<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="../js/jquery-3.5.1.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<form action="" method="">
			<input type="text" name="account" value="111" />
			<br>
			<input type="password" name="password" value="222" />
			<br>
			<input type="text" name="password" value="222" />
			<br>
			<input type="checkbox" name="rem" value="1" />篮球
			<br>
			<input type="checkbox" name="rem" value="1" />足球
			<br>
			<input type="checkbox" name="rem" value="1" />手球
			<br>
			<input type="checkbox" name="rem" value="1" />羽毛球
			<br>
			<button type="button">获取所有选中的checkbox</button>
		</form>
		<script type="text/javascript">
			$(function(){
				let account = $("input[type='text']").val(); //val只会获取第一个元素的value
				console.log(typeof(account));
				console.log(account);
				$("input[type='password']").val("1234");
				console.log($("input[type='checkbox']"));
				
				//添加事件
				$("input[type='checkbox']").change(function(event){
					// console.log(a,b,c);
					//this 关键字，表示当前执行的对象
					// console.log(this);
					if(this.checked){
						//所有获取表单的值只有val
						console.log($(this));
						console.log($(this).val());
						console.log($(this).text());
						console.log($(this).html());
					}
				});
				$("button").click(function(){
					// console.log($("input:checked")); //这种方法不方便
					//JQuery遍历获取到的元素数组
					/* 
						each函数
							index：索引
							item：dom对象
					 */
					//筛选器----归类于选择器的一种
					$("input:checked").each(function(index,item){
						// console.log(a,b);
						console.log(item,value);
					});
				});
			});
		</script>
	</body>
</html>
